<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="css/reset.css"/>
    <link rel="stylesheet" href="css/index.css"/>
</head>
<body>
    <!--header-->
    <div class="header">
        <p>AGRO <b>+</b> </p>
        <p>AGRICULTURE PORTAL</p>
        <p>DISCOVER THE FEATURES OF AGRO<b> + </b>THEME</p>
    </div>
<!--header-->




    <!--nav-->
   <div class="nav ">
       <div class="items clearfix center">
           <ul class="clearfix">
               <li><a href="">首页</a></li>
               <li><a href="">关于我们</a></li>
               <li><a href="">服务</a></li>
               <li><a href="">产品 </a></li>
               <li><a href="">联系我们</a></li>
               <li><input type="text" placeholder="输入关键字"/><a href="">搜索</a></li>

           </ul>
       </div>

   </div>
<!--nav-->



<!--contents-->
    <div class="content center">
        <div class="top">
            <ul class="clearfix">
            <li>
                <a href=""><h2>时兴技术</h2></a>
                <p>我们为您提供各种技术杂志,您在 <br/>这里可以了解时下最新的技术与资料</p>
            </li>
            <li>
                <a href=""><h2>时兴技术</h2></a>
                <p>我们为您提供各种技术杂志,您在<br/>这里可以了解时下最新的技术与资料</p>
            </li>
            <li>
                <a href=""><h2>时兴技术</h2></a>
                <p>我们为您提供各种技术杂志,您在<br/>这里可以了解时下最新的技术与资料</p>
            </li>
        </ul>
        </div>
        <div class="down">
            <ul class="clearfix">
                <li>
                    <a href=""><h2>时兴技术</h2></a>
                    <p>我们为您提供各种技术杂志,您在<br/>这里可以了解时下最新的技术与资料</p>
                </li>
                <li>
                    <a href=""><h2>时兴技术</h2></a>
                    <p>我们为您提供各种技术杂志,您在<br/>这里可以了解时下最新的技术与资料</p>
                </li>
                <li>
                    <a href=""><h2>时兴技术</h2></a>
                    <p>我们为您提供各种技术杂志,您在<br/>这里可以了解时下最新的技术与资料</p>
                </li>
            </ul>
        </div>

    </div>
<!--contents-->



<!--news-->
    <div class="NEWS">
    <div class="news center">
        <div class="title">
            <h1>我们的新闻</h1>
            <span>我们为您提供各种技术杂志,您在这里可以了解时下最新的技术与资料</span>
        </div>
        <ul class="clearfix">
            <li>

                <div class="information">
                    <div class="picture">
                        <img src="images/img4.jpg" alt=""/>
                    </div>
                   <h2>农业咨询</h2>
                    <span>我们为您提供各种技术杂志,您在这里可以<br/>了解时下最新的技术与资料</span>
                    <a href="">更多..</a>
                    </div>
            </li>
            <li>

                <div class="information">
                    <div class="picture">
                        <img src="images/img1.jpg" alt=""/>
                    </div>
                    <h2>农业咨询</h2>
                    <span>我们为您提供各种技术杂志,您在这里可以<br/>了解时下最新的技术与资料</span>
                    <a href="">更多..</a>
                </div>
            </li>
            <li>

                <div class="information">
                    <div class="picture">
                        <img src="images/img2.jpg" alt=""/>
                    </div>
                    <h2>农业咨询</h2>
                    <span>我们为您提供各种技术杂志,您在这里可以<br/>了解时下最新的技术与资料</span>
                    <a href="">更多..</a>
                </div>
            </li>
            <li>

                <div class="information">
                    <div class="picture">
                        <img src="images/img3.jpg" alt=""/>
                    </div>
                    <h2>农业咨询</h2>
                    <span>我们为您提供各种技术杂志,您在这里可以<br/>了解时下最新的技术与资料</span>
                    <a href="">更多..</a>
                </div>
            </li>
        </ul>

        </div>
    </div>
<!--news-->


<!--banner-->
    <div class="banner">
        <p>TESTMONIALS</p>
        <span>最新的农业资讯全在这里</span>
        <p class="aaa">
            我们为您提供各种技术杂志,您在这里可以了解时下最新的技术与资料我们为您提供各种技术杂志,
            您在这里可以了解时下最新的技术与资料我们为您提供各种技术杂志,您在这里可以了解时下最新
            的技术与资料
        </p>
    </div>

<!--banner-->




<!--other-->
    <div class="OTHER">
    <div class="other center ">
       <span>最新的农业资讯全在这里</span>
        <div class="passage ">
            <img src="images/video.jpg" alt=""/>
            <div class="wraps">
                <span>THE MAJORITY HAVE SUFFERED ALTERATION IN SOME FORM.</span>
                <p>There are many variations of passages of Lorem Ipsum available,
                    but the majority have suffered alteration in some form,
                    by injected humour, or randomised words which don't look even slightly believable. <br/><br/>
                    If you are going to use a passage of Lorem Ipsum,
                    you need to be sure there isn't anything embarrassing hidden in the middle of text.
                    All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary,
                    making this the first true generator on the Internet.<br/><br/>
                    It uses a dictionary of over 200 Latin words,
                    to generate Lorem Ipsum which looks reasonable.
                    There are many variations of passages of Lorem Ipsum available,
                    but the majority have suffered alteration in some form,
                    by injected humour, or randomised words which don't look even slightly believable.
                </p>
            </div>
        </div>
        <div class="survice">
            <span>OUR CAPABILITIES</span>
            <ul>
                <li><b>&gt;</b><a href="">联系我们</a></li>
                <li><b>&gt;</b><a href="">联系我们</a></li>
                <li><b>&gt;</b><a href="">联系我们</a></li>
                <li><b>&gt;</b><a href="">联系我们</a></li>
                <li><b>&gt;</b><a href="">联系我们</a></li>
                <li><b>&gt;</b><a href="">联系我们</a></li>
                <li><b>&gt;</b><a href="">联系我们</a></li>
                <li><b>&gt;</b><a href="">联系我们</a></li>
                <li><b>&gt;</b><a href="">联系我们</a></li>
            </ul>
        </div>
    </div>
    </div>
<!--other-->


<!--catch-->
    <div class="catch center clearfix">
        <p>CATCH ON</p>
        <ul class="contact clearfix">
            <li></a></li>
            <li></a></li>
            <li></a></li>
        </ul>
        <div class="message">
            <div class="post">
                <ul class="clearfix">
                    <li><img src="images/mail.png" alt=""/></li>
                    <li><p> NEWSLETTER</p></li>
                </ul>
            </div>
            <div class="email">
                <ul>
                    <li><input type="text" placeholder="your email here"/><span></span></li>
                </ul>
            </div>
        </div>
    </div>


<!--catch-->


<!--bottom-->
    <div class="bottom">
        <ul class="center clearfix">
            <li><a href="">首页</a></li>
            <li><a href="">首页</a></li>
            <li><a href="">首页</a></li>
            <li><a href="">首页</a></li>
            <li><a href="">首页</a></li>
            <li><a href="">首页</a></li>
            <li><a href="">首页</a></li>
        </ul>
    </div>


<!--bottom-->

</body>
</html>